<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<title>Forum</title>
</h:head>
<f:view>
	<body>
		<ui:composition template="../includes/template.xhtml">
			<ui:define name="mainbody">
				<p:panel header="Forum" style="min-height: 550px"
					styleClass="prime_panel">
					<p:growl id="growl" showDetail="true" sticky="false"
						autoUpdate="true" showSummary="false" />

					<!-- Main content in the Forum Panel -->
					<div id="topicButton">
						<p:commandButton value="New Topic" onclick="topic.show();" type="button"/>
					</div>
					<br />
					<div id="questionsTable">
						<p:dataTable id="dataTable" var="post"
							value="#{forumBean.forumPosts}" paginator="true" rows="10"
							paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
							rowsPerPageTemplate="5,10,15" paginatorPosition="bottom">

							<p:column>
								<f:facet name="header">
									<h:outputText value="Recent Posts" />
								</f:facet>
								<a href="ViewPost.xhtml?id=#{post.postId}"> <h:outputText
										value="#{post.subject}" /> </a>
							</p:column>
						</p:dataTable>
					</div>
					
					<p:dialog id="topicDialog" header="New Topic"
						widgetVar="topic" height="280"
						showEffect="fade" hideEffect="explode">  
					    <h:outputText value="Post a new Topic" />					    
						<div id="topic" style="margin-top:8px">
							<h:form>
								<h:panelGrid columns="2" cellpadding="5">
								<h:outputText value="Topic" />
								<p:inputText maxlength="50" title="Topic of the Post"
									value="#{forumBean.topic}"
									required="true" requiredMessage="Please enter a Topic"
									size="25"/>
									
								<h:outputText value="Description" />	
								<p:inputTextarea maxlength="250" title="Topic"
									value="#{forumBean.message}" required="true"
									requiredMessage="Please enter the Description"
									cols="25" rows="5" />
								</h:panelGrid>
								<center>
									<p:commandButton ajax="false" value="Post"
									action="#{forumBean.post}" />
								</center>
							</h:form>
						</div> 
					</p:dialog> 
				</p:panel>
			</ui:define>
		</ui:composition>
	</body>
</f:view>
</html>